<extend name="Layout::index"/>
<block name="title">
    <title>装修报价</title>
</block>
<block name="content">

    <div class="zxbj">
        <div class="zxbj1">
            <div class="zxbj2">当前位置：<a href="#">沪佳工厂店</a> > 装修报价</div>

            <div class="zxbj3">
                <div class="zxbj4">快速在线报价</div>
                <div class="zxbj5">已有<span style="color:#FF0; font-weight:bold"> 155775</span> 位业主成功获取报价
                    <p style="font-size:12px">(截止到2016年10月26日)</p>
                </div>
                <div class="zxbj6">
                    <div class="zxbj7">
                        <span class="zxbj_text">&nbsp;&nbsp;&nbsp;&nbsp;所在城市：</span>
                        <div class="zxbj8"> <input style="outline:none;" name="input2" type="text" size="38" placeholder="目前只支持上海地区" disabled class="zxbj9"/></div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">所在区域：</span><div class="zxbj10">
                        <div >
                            <select class="js-area">
                                <foreach name="arrArea" item="val">
                                <option value="{$val['id']}">{$val['name']}</option>
                                </foreach>
                            </select>
                        </div>
                    </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">建筑面积：</span>
                        <div class="zxbj8"> <input style="outline:none;" name="input2" maxlength="6" type="text" size="38" placeholder="请输入建筑面积" onfocus="this.value=''" class="zxbj9 js-place"/>m²
                        </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">所在小区：</span>
                        <div class="zxbj8"> <input style="outline:none;" name="input2" type="text" size="38" placeholder="请输入小区名" onfocus="this.value=''" class="zxbj9 js-plot" />
                        </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">您的称呼：</span>
                        <div class="zxbj8"> <input style="outline:none;" name="input2" type="text" size="38" placeholder="请输入您的称呼" onfocus="this.value=''" class="zxbj9 js-name"/>
                        </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">装修类型：</span><div class="zxbj10">
                        <div >
                            <select  class="js-status" >
                                <option value="10">新房装修</option>
                                <option value="30">旧房装修</option>
                            </select>
                        </div>

                    </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">联系电话：</span>
                        <div class="zxbj8"> <input style="outline:none;" name="input2" maxlength="11" type="text" size="38" placeholder="请输入手机号码" onfocus="this.value=''" class="zxbj9 js-mobile"/>
                        </div>  </div>

                    <div class="zxbj7">
                        <span class="zxbj_text"><img src="__PUBLIC__/home/img/xx.gif" width="16" height="14">验证码：&nbsp;&nbsp;&nbsp;&nbsp;</span><div class="zxbj8_yzm"> <input style="outline:none;" name="input2" type="text" size="10" placeholder="请输入验证码" onfocus="this.value=''" class="zxbj9 js-yzm"/></div>
                        &nbsp;&nbsp;&nbsp;&nbsp;   <a class="js-yzm1"><img src="__PUBLIC__/home/img/yzm.gif" width="130" height="38"></a></div>

                    <div class="zxbj11">
                        <button type="button" class="btn btn-primary btn-lg js-click"  style=" border:none; "> <a href="#"><img src="__PUBLIC__/home/img/zxbj10.gif" width="227" height="38"></a>
                        </button>
                        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                            <div class="modal-dialog" style="width:738px; margin:50px auto">
                            </div>
                        </div>
                        <!-- Modal -->
                        <div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                            <div class="modal-dialog" style="width:550px; margin:50px auto">
                                <div class="modal-content2">
                                    <div class="modal-header2">
                                        <button type="button" class="close2" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only"> </span></button>
                                    </div>

                                    <div class="modal-body">
                                        <!-- 内容 -->
                                    </div>
                                </div>
                            </div>
                        </div>


                    </div>

                </div>
            </div>
        </div>

    </div>

    <script>
        jQuery(document).ready(function ($){
            $('.js-left>li:nth-child(2)').addClass('present');
        })
        //获取验证码
        $('.js-yzm1').click(function(){

            var place= Trim($('.js-place').val());
            var place1 =/^\d{1,7}$/;
            if(place.length == 0){
                alert('请输入您的房屋面积');
                return false;
            }
            if(!place1.test(place)){
                alert('面积有误！');
                return false;
            }
            var name= Trim($('.js-name').val());
            if(name.length == 0){
                alert('请输入您的称呼');
                return false;
            }
            var mobile= Trim($('.js-mobile').val());
            var phone=/^1[3|4|5|8|7][0-9]\d{8}$/;
            if(mobile.length=0){
                alert('号码不能为空');
                return false;
            }
            if(!phone.test(mobile)) {
                alert('号码有误！');
                return false;
            }
            var plot = Trim($('.js-plot').val());
            if(plot.length == 0){
                alert('小区名不能为空')
            }
            var area = $('.js-area').val();
            var status = $('.js-status').val();

            $.ajax({
                type: "POST",
                url: "{:U('Index/message')}",
                data: {mobile:mobile},
                dataType:"html",
                success: function(data){
                    alert(data);
                }
            });
        });


        $('.js-click').click(function(){
            var place= Trim($('.js-place').val());
            var place1 =/^\d{1,7}$/;
            if(place.length == 0){
                alert('请输入您的房屋面积');
                return false;
            }
            if(!place1.test(place)){
                alert('面积有误！');
                return false;
            }
            var name= Trim($('.js-name').val());
            if(name.length == 0){
                alert('请输入您的称呼');
                return false;
            }
            var mobile= Trim($('.js-mobile').val());
            var phone=/^1[3|4|5|8|7][0-9]\d{8}$/;
            if(mobile.length=0){
                alert('号码不能为空');
                return false;
            }
            if(!phone.test(mobile)) {
                alert('号码有误！');
                return false;
            }
            var plot = Trim($('.js-plot').val());
            if(plot.length == 0){
                alert('小区名不能为空')
            }
            var area = $('.js-area').val();
            var status = $('.js-status').val();
            var yzm= Trim($('.js-yzm').val());
            var yzm1 =/^\d{1,7}$/;
            if(yzm.length=0){
                alert('验证码不能为空');
                return false;
            }
            if(!yzm1.test(yzm)) {
                alert('验证码有误！');
                return false;
            }
            $.ajax({
                type: "POST",
                url: "{:U('Zxbj/confirm')}",
                data: {
                    name:name,
                    place:place,
                    area:area,
                    status:status,
                    yzm:yzm,
                    plot:plot,
                    mobile:mobile
                },
                dataType:"html",
                success: function(data){
                    if(data == 1){
                        alert(13);
                    }else{
                        alert(data);
                    }
                }
            });
        });
        function Trim(str) {
            return (str + '').replace(/(\s+)$/g, '').replace(/^\s+/g, '');
        }
    </script>
</block>